/**
* 页面容器，页面提供导航等页面基础配置
*/
import React, { Component } from 'react';
import { View, StatusBar, StyleSheet, Platform, BackHandler, DeviceEventEmitter } from 'react-native';
import { connect } from 'react-redux';
import { Actions, Router, Scene, Modal, Overlay, Stack, Lightbox } from 'react-native-router-flux';
/** 自定义 */
import { routerReducerCreate, getStore } from './redux/index';
/** 所有页面 */
import * as Scenes from './views/index';
import { ImageRes, Colors } from './utils/Assets';
const statusBackColor = Platform.select({ android: 'rgba(55, 142, 251, 1)', ios: 'transparent' })

class RootView extends Component {
    constructor(props) {
        super(props);
        this.state = {
            statusBackColor: statusBackColor
        };
        this.userInfo = getStore().getState().auth.userInfo
    }
    componentWillMount() {

    }
    componentWillUnmount() {
    }
    initRouterPage() {
        if (this.userInfo) {
            return (
                <Modal hideNavBar>
                    {this.renderRoot()}
                    {this.renderAuth()}
                </Modal>
            )
        } else {
            return (
                <Modal hideNavBar>
                    {this.renderAuth()}
                    {this.renderRoot()}
                </Modal>
            )
        }
    }
    render() {
        let { statusBackColor } = this.state;
        return (
            <View style={styles.container}>
                <StatusBar backgroundColor={statusBackColor} barStyle={'light-content'} />
                <Router createReducer={routerReducerCreate} backAndroidHandler={backAndroidHandler} panHandlers={null}>
                    <Overlay>
                        {this.initRouterPage()}
                    </Overlay>
                </Router>
            </View>
        );
    }
    renderRoot() {
        return (
            <Lightbox key='root'>
                <Stack key='root'  {...FrameStyles} backButtonImage={ImageRes.common_icon_back}>
                    <Scene key="main" component={Scenes.MainView} hideNavBar />
                    <Scene key="teamManagerListView" component={Scenes.TeamManagerListView} title={'团队管理'} />
                    <Scene key="teamManagerView" component={Scenes.TeamManagerView} hideNavBar />
                    <Scene key="teamRateView" component={Scenes.TeamRateView} title={'详情'} />
                    <Scene key="teamChangeRateView" component={Scenes.TeamChangeRateView} />
                    <Scene key="teamRankListView" component={Scenes.TeamRankListView} hideNavBar />
                    <Scene key="teamWeeklyTradeView" component={Scenes.TeamWeeklyTradeView} hideNavBar />
                    <Scene key="teamWeeklyTeamDataView" component={Scenes.TeamWeeklyTeamDataView} hideNavBar />
                    <Scene key="teamWeeklyActiveView" component={Scenes.TeamWeeklyActiveView} hideNavBar />
                    <Scene key="profitWithdrawView" component={Scenes.ProfitWithdrawView} title={'提现'} />
                    <Scene key="profitWithdrawListView" component={Scenes.ProfitWithdrawListView} title={'提现记录'} />
                    <Scene key="profitBankListView" component={Scenes.ProfitBankListView} title={'选择银行卡'} />
                    <Scene key="profitDetailView" component={Scenes.ProfitDetailView} title={'收益明细'} />
                    <Scene key="profitWithdrawResultView" component={Scenes.ProfitWithdrawResultView} title={'提现申请'} />
                    <Scene key="personalSettingView" component={Scenes.PersonalSettingView} title={'设置'} />
                    <Scene key="personalModifyOldPhoneView" component={Scenes.PersonalModifyOldPhoneView} title={'修改手机号'} />
                    <Scene key="personalModifyNewPhoneView" component={Scenes.PersonalModifyNewPhoneView} title={'修改手机号'} />
                    <Scene key="personalModifyLoginPasswordView" component={Scenes.PersonalModifyLoginPasswordView} title={'修改登录密码'} />
                    <Scene key="forgotPasswordView" component={Scenes.ForgotPasswordView} title={'忘记密码'} />
                    <Scene key="personalAboutUsView" component={Scenes.PersonalAboutUsView} title={'关于我们'} />
                    <Scene key="personalFeedbackView" component={Scenes.PersonalFeedbackView} title={'意见反馈'} />
                    <Scene key="personalSystemMessageView" component={Scenes.PersonalSystemMessageView} title={'系统通知'} />
                    <Scene key="personalBankListView" component={Scenes.PersonalBankListView} title={'银行卡'} hideNavBar />
                    <Scene key="personalAddBankView" component={Scenes.PersonalAddBankView} title={'添加银行卡'} />
                    <Scene key="personalAuthOneView" component={Scenes.PersonalAuthOneView} title={'实名认证'} />
                    <Scene key="personalAuthTwoView" component={Scenes.PersonalAuthTwoView} title={'实名认证'} />
                    <Scene key="personalAuthThreeView" component={Scenes.PersonalAuthThreeView} title={'实名认证'} onBack={() => {
                        DeviceEventEmitter.emit('ReGetUserInfo')
                        Actions.popTo('main')
                    }} />
                    <Scene key="personalWithdrawPasswordView" component={Scenes.PersonalWithdrawPasswordView} title={'提现密码'} />
                    <Scene key="personalReWithdrawPasswordView" component={Scenes.PersonalReWithdrawPasswordView} title={'提现密码'} />
                    <Scene key="profitWithdrawDetailView" component={Scenes.ProfitWithdrawDetailView} title={'提现记录'} />
                    <Scene key="profitListView" component={Scenes.ProfitListView} hideNavBar />
                    <Scene key="profitListDetailView" component={Scenes.ProfitListDetailView} title={'明细'} />
                    <Scene key="personalShareImageView" component={Scenes.PersonalShareImageView} title={'长按分享'} />
                    <Scene key="teamBalanceView" component={Scenes.TeamBalanceView} title={'结算价'} />

                    <Scene key="BankCardListView" component={Scenes.BankCardListView} hideNavBar title={'我的银行卡'}  />
                    <Scene key="BankCardInfoView" component={Scenes.BankCardInfoView} title={'修改银行卡'}  />

                    <Scene key="AddCreditCardView"  component={Scenes.AddCreditCardView} title={'添加信用卡'} />
                </Stack>
                <Scene key='custormPicker' component={Scenes.CustormPicker} />
                <Scene key="withdrawPasswordView" component={Scenes.WithdrawPasswordView} />
                <Scene key="commonDatePicker" component={Scenes.CommonDatePicker} />

                
            </Lightbox>
        )
    }
    renderAuth() {
        return (
            <Lightbox key='auth'>
                <Stack  {...FrameStyles} backButtonImage={ImageRes.common_icon_back}>
                    <Scene key="loginView" component={Scenes.LoginView} hideNavBar />
                    <Scene key="rigisterView" component={Scenes.RigisterView} title={'注册'} />
                    <Scene key="forgotPasswordView" component={Scenes.ForgotPasswordView} title={'忘记密码'} />
                </Stack>
            </Lightbox>
        );
    }
}
const backAndroidHandler = (props) => {
    if (Actions.currentScene == 'main' || Actions.currentScene == 'loginView') {
        BackHandler.exitApp()
    } else {
        Actions.pop();
    }
    return true;
}
const BackTextPadding = Platform.select({ android: 5, ios: 2 })
const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
});

const FrameStyles = {
    navigationBarStyle: {
        backgroundColor: 'rgba(55, 142, 251, 1)',
        borderBottomWidth: StyleSheet.lineWidth,
        borderBottomColor: '#e0e0e0',
    },
    titleStyle: {
        color: "#ffffff",
        alignSelf: 'center',
        justifyContent: 'center',
        fontSize: 16
    },
    leftButtonIconStyle: {
        width: 25,
        height: 25
    },
    rightButtonTextStyle: {
        color: '#ff8e00',
        textAlign: 'justify',
        includeFontPadding: false,
        textAlignVertical: 'center',
    },
    rightButtonStyle: {
        paddingLeft: 10,
        justifyContent: 'center'
    },
    backButtonTextStyle: {
        paddingTop: BackTextPadding,
        paddingLeft: 0,
        color: '#333333',
        textAlign: 'justify',
        includeFontPadding: false,
        textAlignVertical: 'center',
    },
    // headerStyle: {
    //     elevation: 0,
    //     borderBottomWidth: 1,
    //     borderBottomColor: '#e0e0e0',
    //     height: 50,
    //     backgroundColor:'rgba(55, 142, 251, 1)'
    // },
    backButtonTintColor: '#ffffff'
}
export default connect()(RootView)
